<template>
  <div class="mod-group-table">
    <div class="hd">{{ title }}</div>
    <div class="bd">
      <template v-for="(d, name) in data">
        <SectionTable
          :key="name"
          :title="`${name}（${d.length}）`"
          :columns="columns"
          :data="d"
        />
      </template>
    </div>
  </div>
</template>

<script>
import SectionTable from "./Table";

export default {
  components: { SectionTable },

  props: {
    title: {
      type: String,
      required: true
    },
    columns: {
      type: Array,
      required: true
    },
    data: {
      type: Object,
      required: true
    }
  },
  setup() {}
};
</script>

<style scoped></style>
